/*
  当前项目的js代码
*/
function welcomeLoaded(){
	oContent = $('content');
	var oWelcome = $('welcome');

	setTimeout(function(){
		removeClass(oWelcome,'show');
		//再给内容页面加上show类(中午的练习)
		addClass(oContent,'show');
		//给轮播图绑定触摸事件
		changePic();
		//评分
		score();

		//找到submit这个提交按钮
		var oSubmit = document.getElementsByName('submit')[0];
		bindEvent(oSubmit,"touchstart",validate);
	},4)
}
//图片轮播图
function changePic(){
	var oUl = document.getElementsByClassName("pic")[0];
	//给ul绑定触摸事件
	bindEvent(oUl,"touchstart",fnStart);
	bindEvent(oUl,"touchmove",fnMove);
	bindEvent(oUl,"touchend",fnEnd);

	//手指开始的位置
	var startX = 0;	
	//记录上次滑动的距离
	var previousDistance = 0;
	//本次滑动的距离
	var slideDistance = 0;
	//小圆点
	var oDesc = document.getElementsByClassName("desc")[0].getElementsByTagName("ul")[0];
	var oLis = oDesc.getElementsByTagName('li');

	//默认当前页面是0
	var iNow = 0;
	var timer = setInterval(autoPlay, 2000);
	function autoPlay(){
		iNow++;
		if(iNow>4){
			iNow = 0;
		}
		//计算平移的距离
		slideDistance = -iNow * document.body.clientWidth;
		oUl.style.transition = 'all 1s';
		oUl.style.transform = 'translateX('+slideDistance+'px)';
		//离开时，拿当前的页面页数 找到li标签，再让该li标签加上active类
		for(var i=0;i<oLis.length;i++){
			//先把所有的active去掉
			removeClass(oLis[i],'active');
			if(iNow==i){
				//让当前li加上active
				addClass(oLis[i],'active');
			}
		}
	}

	function fnStart(e){
		//手指按下时清除定时器
		clearInterval(timer);
		var ev = e || window.event;
		oUl.style.transition = 'none';
		startX = ev.changedTouches[0].pageX;
		//每次按下时，把本次滑动的距离赋值给上一次滑动的距离
		previousDistance = slideDistance;
	}
	function fnMove(e){
		var ev = e || window.event;
		//计算本次滑动的距离
		var distance = ev.changedTouches[0].pageX - startX;

		//滑动的实际距离 == 本次滑动的距离 + 上一次滑动的距离
		slideDistance = distance + previousDistance;

		// oUl.style.transition = "all 0.5s linear";
		oUl.style.transform = "translateX("+slideDistance+"px)";
	}
	function fnEnd(){
		//手指离开屏幕时，开始自动切换
		//根据滑动的距离进行判断，如果超过一半平移一个图片，如果没有超过一半，返回
		//page就是平移的图片的个数（页面的个数，该页面个数会累加）
		var page = -Math.round(slideDistance / document.body.clientWidth);
		console.log(page);

		if(page>4){
			//大于4页的时候，让回到第四页
			page = 4;
		}
		if(page<0){
			page = 0;
		}
		//计算平移的距离 ==  page个数 * 每个页面的宽度
		slideDistance = -page * document.body.clientWidth;
		oUl.style.transition = 'all 1s';
		oUl.style.transform = 'translateX('+slideDistance+'px)';

		//离开时，拿当前的页面页数 找到li标签，再让该li标签加上active类
		for(var i=0;i<oLis.length;i++){
			//先把所有的active去掉
			removeClass(oLis[i],'active');
			if(page==i){
				//让当前li加上active
				addClass(oLis[i],'active');
			}
		}
		clearInterval(timer);
		timer = setInterval(autoPlay, 2000);
	}
}

//给星星评分
function score(){
	//先找到3个ul，要给每个ul里面的li标签单独绑定事件
	var oUl = document.getElementsByClassName("star");
	//遍历3个ul
	for(var i=0;i<oUl.length;i++){
		//给每个ul里面的li标签绑定事件		
		bindScore(oUl[i]);		//避免闭包
	}
}
//给当前ul里面的li标签绑定touchstart事件,该事件比onclick大概快0.3秒左右
function bindScore(ul){
	var oLis = ul.getElementsByTagName('li');
	//定义好每个星星对应的分值()
	var scoreInfo = ['很差','较差','一般','良好','非常好'];	
	//再将该分数保存到隐藏域中
	var oHIdden = ul.getElementsByTagName('input')[0];

	for(var i=0;i<oLis.length;i++){
		//给每个li标签增加一个属性oindex保存该标签在数组中的索引位置
		oLis[i].oindex = i;
		bindEvent(oLis[i],'touchstart',function(){
			//获得点击的星星对应的分数信息
			var info = scoreInfo[this.oindex];
			// alert(info);
			oHIdden.value = info;
			//获得当前点击的li标签的索引
			// alert(this.oindex);
			//小于等于当前索引的都被选中
			for(var j=0;j<oLis.length;j++){	
				//先删除所有的active
				removeClass(oLis[j],'active');
				if(j<=this.oindex){
					//再让小于当前索引的被选中
					addClass(oLis[j],'active');
				}
			}			
		});
	}
}

//验证是否给景区添加标签
function checkTags(){
	//遍历所有的radio，只要有任何一个的checked属性是true,返回true
	var radios = document.getElementsByName('tag');
	for(var i=0;i<radios.length;i++){
		if(radios[i].checked){
			//说明选中了，也就是添加标签了
			return true;
		}
	}
	//执行到这里说明，都没有选中
	return false;
}

//验证是否评分,只需要判断每个ul里面的hidden隐藏域是否为0
function checkScore(){
	var oUl = document.getElementsByClassName('star');
	for(var i=0;i<oUl.length;i++){
		//找到每个ul里面的隐藏域
		var oHIdden = oUl[i].getElementsByTagName('input')[0];
		if(oHIdden.value==0){
			//说明没有评分呢
			return false;
		}
	}
	//执行到这里，说明都已经评分了
	return true;
}

//验证是否评分、是否添加标签
function validate(){
	//先判断是否评分
	if(checkScore()){
		//说明评分了，还要判断是否添加标签
		if(checkTags()){
			//添加标签了
			//让内容页面隐藏、让感谢页面显示
			removeClass(oContent,'show');
			var oThank = $('thank');	//找到感谢页面
			addClass(oThank,'show');
		}else{
			//显示没有添加标签的错误信息
			showMsg('请给景区添加标签');
		}
	}else{
		//显示没有评分的错误信息
		showMsg('请给景区评分');
	}
}
//将显示错误信息的代码封装到这里
function showMsg(msg){
	var oP = document.getElementsByClassName('msg')[0];
	oP.innerText = msg;
	oP.style.transition = 'all 1s';
	oP.style.opacity = 1;
	oP.style.transform = "scale(1)";
	//2秒之后让信息消失
	var timer = setTimeout(function(){
		oP.style.transition = 'all 1s';
		oP.style.transform = "scale(0)";
		oP.style.opacity = 0;		
	},2000)
}